import { useState } from 'react'
import type { ThemeType } from './type'
import { ThemeContext } from './theme-context'

/**
 * 主题上下文提供者
 * @param children
 * @returns {JSX.Element}
 */
export const ThemeProvider = ({ children }: { children: React.ReactNode }) => {
	const [themeType, setThemeType] = useState<ThemeType>('light')

	const toggleTheme = () => {
		setThemeType(prev => prev === 'light' ? 'dark' : 'light')
	}

	return (
		<ThemeContext.Provider value={{ themeType, toggleTheme }}>
			{children}
		</ThemeContext.Provider>
	)
}
